<template>
  <div class="pageBox">
    <a-row>
      <a-col :span="24">
        <a-form-model
          ref="commonForm"
          :model="formData"
          :rules="rules"
          v-bind="layout"
        >
          <a-divider orientation="left">编号</a-divider>
          <a-form-model-item label="合同号" prop="contractNumber">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.contractNumber"
            />
          </a-form-model-item>
          <a-form-model-item label="机床编号" prop="macNum">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.macNum"
            />
          </a-form-model-item>
          <a-divider orientation="left">产品</a-divider>
          <a-form-model-item label="产品名称" prop="productName">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.productName"
            />
          </a-form-model-item>
          <a-form-model-item label="产品型号" prop="productType">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.productType"
            />
          </a-form-model-item>
          <a-form-model-item label="产品规格" prop="productSpecification">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.productSpecification"
            />
          </a-form-model-item>
          <a-form-model-item label="装配模板" prop="equipmentMouldId">
            <a-select
              :disabled="pageType == 'detail'"
              v-model="formData.equipmentMouldId"
              show-search
              option-filter-prop="children"
              :filter-option="filterOption"
            >
              <a-select-option
                v-for="item in mouldList"
                :key="item.id"
                :value="item.id"
                >{{ item.name }}</a-select-option
              >
            </a-select>
          </a-form-model-item>
          <a-divider orientation="left">订货信息</a-divider>
          <a-form-model-item label="订货日期" prop="orderDate">
            <a-date-picker
              :disabled="pageType == 'detail'"
              v-model="formData.orderDate"
              :disabled-date="disabledOrderDate"
              @change="orderDateChange"
              placeholder="选择订货日期"
              style="width: 100%;"
            />
            <!-- :defaultValue="getCurrentMonth" -->
            <!-- @change="onMonthChange" -->
            <!-- :locale="locale" -->
          </a-form-model-item>
          <a-form-model-item label="交货日期" prop="deliveryDate">
            <a-date-picker
              :disabled="pageType == 'detail'"
              v-model="formData.deliveryDate"
              :disabled-date="disabledDeliveryDate"
              @change="deliveryDateChange"
              placeholder="选择交货日期"
              style="width: 100%;"
            />
          </a-form-model-item>
          <a-form-model-item label="订货单位" prop="orderCompany">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.orderCompany"
            />
          </a-form-model-item>
          <a-form-model-item label="订货单位代码" prop="orderCompanyNumber">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.orderCompanyNumber"
            />
          </a-form-model-item>
          <a-form-model-item label="BOM编码" prop="bomCode">
            <a-input
              :disabled="pageType == 'detail'"
              v-model="formData.bomCode"
            />
          </a-form-model-item>
        </a-form-model>
      </a-col>
    </a-row>
    <a-row>
      <a-col :span="24" style="text-align: center;">
        <a-button
          type="primary"
          v-show="pageType == 'new'"
          @click="submitHandle('commonForm')"
          style="width: 120px;margin:0 0 12px 0"
          >确认提交</a-button
        >
      </a-col>
    </a-row>
  </div>
</template>

<script>
import api from "@/server/mouldConfig.js";
import { getRoleId } from "@/unit/tool";
import mixin from "./components/mixin.js";
import moment from "moment";
// import CheckStep from '@/components/checkStep/index';
// import CreateForm from '@/components/createForm/index';

export default {
  name: "assembleTemplateNew",
  mixins: [mixin],
  components: {},
  computed: {},
  data() {
    return {
      userName: "",
      name: "",
      role: "",
      compId: "",
      pageType: "new",
      formData: {
        contractNumber: "", //合同号
        macNum: "", //机床编号
        productName: "", //产品名称
        productType: "", //产品型号
        productSpecification: "", //产品规格
        equipmentMouldId: "", //装配模板
        orderDate: "", //订货日期
        deliveryDate: "", //交货日期
        orderCompany: "", //订货单位
        orderCompanyNumber: "", //订货单位代码
        bomCode: "" //BOM编码
      },
      mouldList: [],
      orderDate: "",
      deliveryDate: "",
      rules: {},
      layout: {
        layout: "horizontal",
        labelAlign: "right",
        hideRequiredMark: true,
        labelCol: { span: 3 },
        wrapperCol: { span: 18 }
      }
    };
  },
  computed: {},
  watch: {
    // currentStep: function(n, o) {
    //   console.log(n);
    // },
  },
  methods: {
    moment,
    disabledOrderDate(current){
      return current && current > moment(this.formData.deliveryDate).endOf('day')
    },
    disabledDeliveryDate(current){
      if(this.formData.orderDate.startOf('day') < moment().startOf('day')) {
        return current && current < moment().startOf('day')
      }else{
        return current && current < moment(this.formData.orderDate).startOf('day')
      }
    },
    orderDateChange(date, dateString) {
      this.orderDate = `${dateString} 00:00:00`;
    },
    deliveryDateChange(date, dateString) {
      this.deliveryDate = `${dateString} 00:00:00`;
    },
    submitHandle(formName) {
      let _this = this;
      _this.$refs[formName].validate(async valid => {
        if (!valid) return;
        let {
          orderDate,
          deliveryDate,
          equipmentMouldId,
          ...rest
        } = _this.formData;
        let params = Object.assign(_this.formData, {
          orderDate: this.orderDate,
          deliveryDate: this.deliveryDate,
          companyId: _this.compId
        });
        // let params = {
        //   // equipmentMouldId: 1, //模板id
        //   // mouldName: '', //模板名
        //   // contractNumber: 'vv', //合同号
        //   // macNum: '21', //机床编号
        //   // productName: 'vv', //产品名称
        //   // productType: 'vv', //产品型号
        //   // productSpecification: 'vv', //产品规格
        //   // orderDate: '2021-09-16T16:00:00.000Z', //订货日期
        //   // deliveryDate: '2021-09-19T16:00:00.000Z', //交货日期
        //   // orderCompany: 'vv', //订货单位
        //   // orderCompanyNumber: 'vv', //订货单位代码
        //   // bomCode: 'vv', //BOM编码
        //   orderDate: this.orderDate,
        //   deliveryDate: this.deliveryDate,
        //   cncSystem: "",
        //   rail: "",
        //   mainBearing: "",
        //   screw: "",
        //   mainMotor: "",
        //   machineAccept: "",
        //   toolCase: "",
        //   speciaRequire: "",
        //   companyId: _this.compId, //厂id
        //   // orderId: _this.role
        // };
        api
          .addOrder(params)
          .then(res => {
            if (res.code == 9000) {
              this.$message.error(res.message);
              return;
            }
            if (res.code != 200) {
              this.$message.error("订单创建失败");
              return;
            } else {
              this.$message.success("订单创建成功");
              this.$router.push("/assembleOrder");
            }
          })
          .catch(err => {
            console.log("err", err);
          });
      });
    },
    getMouldLists() {
      api.getMouldList(this.compId).then(res => {
        if (res.code == 200) [(this.mouldList = res.data)];
      });
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    }
  },
  mounted() {},
  created() {
    getRoleId(this);
    this.getMouldLists();
    if (this.$route.query.orderId) {
      this.pageType = "detail";
      api.findOrderById(this.$route.query.orderId).then(res => {
        if (res.code == 200) {
          this.formData = { ...res.data };
        }
      });
    }
  }
};
</script>

<style scoped="scoped" lang="less">
@import "./components/style.css";
</style>
